<!DOCTYPE html>


<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Toon 登录</title>
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>
    <!--<div class="login">
    <div class="login_box">
        <div class="login_box_inside">
            <p class="title_tip">扫码登录</p>
            <div class="erweima">
                <div class="erweima_img">
                    <img src="" alt="">
                    <div class="mask_layer"></div>
                </div>
                <div class="tip1">
                    <img src="/resources/images/success.png" alt="">
                    <p>扫码成功</p>
                </div>
                <div class="tip2">
                    <img src="/resources/images/refresh.png" alt="">
                    <p>二维码已过期请点击刷新</p>
                </div>
            </div>
            <div class="footer_tip">
                <p>扫描二维码登录企通组织平台-普通用户-测试</p>
            </div>
        </div>
    </div>
</div>-->

    <div class="login">
        <div class="login-title-box">
            <div class="wrap">
                <div class="login-title">
                    <div class="logo-box">
                        <img src="./images/logo.png" class="icon-logo" alt="">
                    </div>
                    <div class="login-btn-box">
                        <span class="login-btn">北京通登录</span>
                    </div>
                </div>
            </div>
        </div>
        <div class="login-box">
            <div class="wrap">
                <div class="fast-login">快速登录</div>
                <div class="login-tip"><img class="scan-img" src="./images/scan.png" alt="扫描二维码">使用北京通APP扫码登录</div>
                <div id="qrCodeBox" class="qr-code-box" style="display: block;">
                    <img class="qr-code-img" src=""
                        alt="">
                    <div id="masker" class="masker"></div>
                </div>
                <!-- 扫码成功 -->
                <div id="success" class="success">
                    <div class="success-img-box">
                        <img class="success-img" src="./images/success.png" alt="">
                    </div>
                    <div class="success-text">扫码成功！</div>
                    <div class="success-tip">请在手机上点击确认登录</div>
                </div>
                <!-- 过期 -->
                <div id="error" class="error">
                    <div class="error-text">你的二维码已失效</div>
                    <div class="refresh-btn">点击刷新</div>
                </div>

                <!-- 失败 -->
                <div class="fail" id="fail">
                    <div class="toast">登录失败</div>
                </div>
            </div>
        </div>
    </div>

    <script src="./js/jquery-1.11.3.js"></script>
    <script src="./js/poll.min.js"></script>
     <script>
        // url  https://auth.beijingtoon.com/connect/refreshQRStatus?uid=1040987892124202
        // code  3 未扫码 1已扫码 2已授权 4失效
        var url = 'http://api.oauth.systoon.com/connect/refreshQRStatus';
        var uid = '9149904590870394';
        var beginTime = '1499045987041';
        var redirect_uri = 'http://t200.admin.qitoon.com/sso/callback';
        var count = 0;
        if (typeof url === 'string') {
            url = url + '?uid=' + uid;
            var toonLogin = poll({
                test: function () {
                    console.log(beginTime);
                    $.ajax({
                        type: 'get',
                        url: url,
                        dataType: "json",
                        success: function (data) {
                            count += 1;
                            data.status = count;
                            if (data.status == 1) {  // 扫码成功
                                $('#qrCodeBox').hide();
                                $('#error').hide();
                                $('#masker').hide();
                                $('#fail').hide();
                                $('#success').show();
                            } else if (data.status == 2) {   // 授权成功
                                location.href = redirect_uri.indexOf("?") > -1 ? (redirect_uri + "&code= " + e.code) : (redirect_uri + "?code=" + e.code);
                            } else if(data.status == 3) { // 默认状态
                                $('#qrCodeBox').show();
                                $('#error').hide();
                                $('#masker').hide();
                                $('#fail').hide();
                                $('#success').hide();
                            }else if (data.status == 4) {  // 失效
                                $('#qrCodeBox').show();
                                $('#fail').hide();
                                $('#success').hide();
                                $('#error').show();
                                $('#masker').show();
                            } else if (data.status == 5) {  // 失败
                                $('#qrCodeBox').show();
                                $('#fail').show();
                                $('#success').hide();
                                $('#error').hide();
                                $('#masker').hide();
                            } else  {  // 测试
                                location.reload();
                            }
                        },
                        error: function (e) {
                            console.log(e);
                        }
                    });
                },
                ready: function () {

                },
                quit: function () {

                },
                frequency: 2000, //How often to poll in ms (default: 250)
                timeout: 86400000 //ms until quit (default: 30000)
            });
        }
        $('#masker').click(function (e) {
            location.reload();
        })
        $('.refresh-btn').click(function () {
            location.reload();
        })
      
    </script>
</body>

</html>